{% extends "business/ticket.html" %}
{% block content %}
<div>
    <div class="row">
        <div class="col-md-4"><h5><strong>Ticket ID：</strong>{{ ticket.id }}</h5></div>
        <div class="col-md-4"><h5><strong>所属的订单编号：</strong><a href="{% url "show_circuit_order" ticket.order_number %}">{{ ticket.order_number }}</a></h5></div>
        <div class="col-md-4"><h5><strong>所属的客户名称：</strong><a href="{% url "show_customer" ticket.customer_name %}">{{ ticket.customer_name }}</a></h5></div>
    </div>
    <br>

    <div class="row">
        <div class="col-md-4"><strong>故障级别：</strong>{{ ticket.level }}</div>
        <div class="col-md-4"><strong>当前处理人：</strong>{{ ticket.handler }}</div>
        <div class="col-md-4"><strong>当前状态：</strong>{{ ticket.status }}</div>
    </div>
    <br>

    <div class="row">
        <div class="col-md-4">
            <label for="describe">故障详细描述：</label>
            <textarea id="describe" class="form-control" rows="6" cols="50">
{{ ticket.describe }}
            </textarea>
        </div>
        <div class="col-md-4"><strong>客户报障日期：</strong>{{ ticket.start_time }}</div>
        <div class="col-md-4"><strong>处理完成日期：</strong>{{ ticket.end_time }}</div>
    </div>
    <br>

    <div class="row">
        <div class="col-md-8"> 该信息被 {{ customer.creator }} 于 {{ customer.add_date }} 创建，被 {{ customer.modifier }} 于 {{ customer.mod_date }} 最后修改。</div>
    </div>
    <br>

    <a class="btn btn-primary" href="{% url "mod_ticket" ticket.id %}" role="button">编辑</a>
    <button id="DeleteTicket" class="btn btn-primary" href="" role="button">删除</button>
    <button class="btn btn-primary" data-toggle="modal" data-target="#AddTicketMessageModal">新增处理记录</button>

    <script>
        $(function () {
            $("#DeleteTicket").click(function () {
                if(confirm("确定删除 Ticket ID: {{ ticket.id }} 的处理记录?")){
                    $.get("/business/del_ticket?ticket_id={{ ticket.id }}", function () {
                       window.location.replace("/business/ticket");
                    });
                }
            })
        })
    </script>
</div>
<br>

<div class="modal fade" id="AddTicketMessageModal" tabindex="-1" role="dialog" aria-labelledby="TicketMessageModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
        </div>
    </div>
</div>

<script>
    $(function () {
        $("#AddTicketMessageModal").modal({
                keyboard: false,
                show: false,
                remote: "/business/add_ticket_message/{{ ticket.id }}"
            })
    });
</script>

<h4><strong>Ticket处理过程记录</strong></h4>
<div class="well well-sm" id="tickets_info">
<table class="table table-hover table-condensed table-bordered">
    <thead>
        <tr>
            <td width="3%" bgcolor="#C9C9C9">Message ID</td>
            <td width="60%" bgcolor="#C9C9C9">处理内容记录</td>
            <td width="10%" bgcolor="#C9C9C9">添加时间</td>
            <td width="6%" bgcolor="#C9C9C9">添加人</td>
            <td width="10%" bgcolor="#C9C9C9">修改时间</td>
            <td width="6%" bgcolor="#C9C9C9">修改人</td>
            <td width="5%" bgcolor="#C9C9C9">操作</td>
        </tr>
    </thead>
    <tbody>
    {% for ticket_message in ticket_messages %}
        <tr class="success">
            <td>{{ ticket_message.id }}</td>
            <td>{{ ticket_message.message }}</td>
            <td>{{ ticket_message.add_date }}</td>
            <td>{{ ticket_message.creator }}</td>
            <td>{{ ticket_message.mod_date }}</td>
            <td>{{ ticket_message.modifier }}</td>
            <td>
                <button type="button" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#ModTicketMessageModal_{{ ticket_message.id }}">编辑</button>
                <button type="button" class="btn btn-primary btn-xs" id="TicketMessage_{{ ticket_message.id }}">删除</button>
            </td>
        </tr>

        <div class="modal fade" id="ModTicketMessageModal_{{ ticket_message.id }}" tabindex="-1" role="dialog" aria-labelledby="TicketMessageModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                </div>
            </div>
        </div>

        <script>
            $(function () {
                $("#ModTicketMessageModal_{{ ticket_message.id }}").modal({
                        keyboard: false,
                        show: false,
                        remote: "/business/mod_ticket_message/{{ ticket_message.id }}"
                    })
            });
        </script>

        <script>
            $(function () {
                $("#TicketMessage_{{ ticket_message.id }}").click(function () {
                    if(confirm("确定删除 Message ID: {{ ticket_message.id }} 的处理记录?")){
                        $.get("/business/del_ticket_message?ticket_message_id={{ ticket_message.id }}", function () {
                            window.location.reload();
                        });
                    }
                })
            })
        </script>
    {% endfor %}
    </tbody>
</table>
</div>
{% endblock %}
